<template>
  <div class="wave-container absolute left-0 w-full flex items-center flex-col bottom-[120px]">
    <div class="flc h-40px w-[750px] mb-[33px]">
      <img
        :src="getPath()"
        alt="wave"
        class="wave"
      >
    </div>
    <p
      class="w-[750px] h-[84px] px-[12px] text-20px text-[#2F3A56] text-center font-normal leading-[28px] min-h-[20px] tracking-[4px]">
      {{ text }}
    </p>
  </div>
</template>
<script lang="ts" name="VoiceWave" setup>
defineProps<{ text: string }>()
const getPath = () => {
  return new URL(`../../../assets/apng/wave.png`, import.meta.url).href;
}
</script>
<style lang="scss" scoped></style>
